<!DOCTYPE html>
<html lang="zh-Hans">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>happy birthday</title>
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <div class="channel">
        happy birthday
    </div>
    <div class="container">
        <span style="--i:1">H</span>
        <span style="--i:2">A</span>
        <span style="--i:3">P</span>
        <span style="--i:4">P</span>
        <span style="--i:5">Y</span>
        <span style="--i:6">B</span>
        <span style="--i:7">I</span>
        <span style="--i:8">R</span>
        <span style="--i:9">T</span>
        <span style="--i:10">H</span>
        <span style="--i:11">D</span>
        <span style="--i:12">A</span>
        <span style="--i:13">Y</span>
        <span style="--i:14">!</span>
    </div>
</body>

</html>